import Vue from 'vue'

const NoticeConstructor = Vue.extend(require('./Notice.vue').default)
let nId = 1

const Notice = content => {
  let id = 'notice-' + content.id
  const NoticeInstance = new NoticeConstructor({
    data: {
      content: content
    }
  })

  NoticeInstance.id = id
  NoticeInstance.vm = NoticeInstance.$mount() // 挂载但是并未插入dom，是一个完整的Vue实例
  NoticeInstance.vm.visible = true
  NoticeInstance.dom = NoticeInstance.vm.$el
  document.body.appendChild(NoticeInstance.dom) // 将dom插入body
  NoticeInstance.dom.style.zIndex = (nId++) + 1001 // 后插入的Notice组件z-index加一，保证能盖在之前的上面
  return NoticeInstance.vm
}

export default {
  install: Vue => {
    Vue.prototype.$notice = Notice // 将Notice组件暴露出去，并挂载在Vue的prototype上
  }
}
